<!-- htl sytle -->
<!DOCTYPE html>
<html>
<head>
	<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
	<script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>

	
	<title>Full template</title>
	
</head>
<body>

	<div class="row">
		<!-- begin nav bar -->
		<div id="navbar" class="navbar navbar-default">
			
			<div class="navbar-collapse collapse navbar-responsive-collapse">
				

				<ul class="nav navbar-nav navbar-right">
					<li><a href="#">Hello</a></li>
					<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown">hoangthuylink <b class="caret"></b></a>
						<ul class="dropdown-menu">
							<li><a href="#">Sign out</a></li>
							<li class="divider"></li>
							<li><a href="#">Change password</a></li>
						</ul>
					</li>
				</ul>
				<form class="navbar-form navbar-right">
					
					<button type="submit" class="btn btn-default">
						<span class="glyphicon glyphicon-search"></span>
					</button>

					<input type="text" class="form-control col-md-3" placeholder="Search"/>
					<br/>
					<div style="margin-left:0px;">
					<label>
										<input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked="">
										Account number
									</label>
									
									<label>
										<input type="radio" name="optionsRadios" id="optionsRadios1" value="option2" checked="">
										ID card number
									</label>
					</div>
				</form>
				<img src="img/logo.png" alt="LOGO">
			</div>
		</div>

		<!-- end nav bar -->
	</div>

	<div class="row">

		<!-- begin left content -->
		<div id="left_content" class="col-md-3">
			
			


			<div class="row">
				<!-- transaction management -->
				<div class="page-header">
					<h3>Transaction management</h3>
				</div>
				<ul class="nav nav-pills nav-stacked" style="max-width: 300px;">
					<li><a href="#">Create new saving account</a></li>
					<li><a href="#">Create transaction</a></li>
					<li><a href="#">View approved transaction</a></li>

				</ul>
				<!--end transaction managemnet-->

				<div class="page-header">
					<h3>Interest rate <span class="badge pull-right">4</span></h3> 
				</div>
				
			</div>


			

		</div>
		<!-- end left content -->

		<!-- met vl -->
		<!-- begin right content -->
		<div class="col-md-8">

			<div class="row">


				<div class="page-header">
					<h3 class="float_right">Create new saving account</h3>
				</div>

				<!-- begin form -->
							<form class="form-horizontal">
					<fieldset class="fieldSetColor">

						<div class="form-group">
							<label for="account" class="col-lg-4 control-label">Account number</label>
							<div class="col-lg-6">
								<input type="text" class="form-control" id="account" placeholder="Account number">
							</div>
						</div>
						<div class="form-group">
							<label for="amount" class="col-lg-4 control-label">Amount</label>
							<div class="col-lg-6">
								<input type="text" class="form-control" id="amount" placeholder="Amount">

							</div>
						</div>

						<div class="form-group">
							<label class="col-lg-4 control-label">Is Repeatable</label>
							<div class="col-lg-6">
								<div class="radio">
									<label>
										<input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked="">
									Yes
									</label>
								</div>
								<div class="radio">
									<label>
										<input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">
										No
									</label>
								</div>


							</div>
						</div>

						<div class="form-group">
							<label class="col-lg-4 control-label">Money type</label>
							<div class="col-lg-6">
								<select class="form-control">
									<option>VND</option>
									<option>USD</option>

								</select>
							</div>
						</div>
						<div class="form-group">
							<label class="col-lg-4 control-label">Date</label>
							<div class="col-lg-6">
								<div class='input-group date' id='datetimepicker'>
									<input type='text' class="form-control" />
									<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
								</span>
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="col-lg-4 control-label">Period</label>
						<div class="col-lg-6">
							<select class="form-control">
									<option>3 months</option>
									<option>6 months</option>
									<option>9 months</option>

								</select>

						</select>
					</div>
				</div>
				<div class="form-group">
					<div class="col-lg-10 col-lg-offset-3">
						<button class="btn btn-success">Cancel</button>
						<button type="submit" class="btn btn-success">Submit</button>
					</div>
				</div>
			</fieldset>
		</form>
		<!-- end form -->
				<!-- begin form -->
				<div class="page-header">
					<h3 class="float_right">Make new transaction</h3>
				</div>
				<form class="form-horizontal">
					<fieldset>

						<div class="form-group">
							<label for="account" class="col-lg-4 control-label">Saving account number</label>
							<div class="col-lg-6">
								<input type="text" class="form-control" id="account" placeholder="Account number">
							</div>
						</div>
						<div class="form-group">
							<label for="amount" class="col-lg-4 control-label">Amount</label>
							<div class="col-lg-6">
								<input type="text" class="form-control" id="amount" placeholder="Amount">

							</div>
						</div>

						<div class="form-group">
							<label class="col-lg-4 control-label">Transaction type</label>
							<div class="col-lg-6">
								<div class="radio">
									<label>
										<input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked="">
										Deposit
									</label>
								</div>
								<div class="radio">
									<label>
										<input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">
										Withdraw
									</label>
								</div>


							</div>
						</div>

						<div class="form-group">
							<label class="col-lg-4 control-label">Money type</label>
							<div class="col-lg-6">
								<select class="form-control">
									<option>VND</option>
									<option>USD</option>

								</select>
							</div>
						</div>
						<div class="form-group">
							<label class="col-lg-4 control-label">Date</label>
							<div class="col-lg-6">
								<div class='input-group date' id='datetimepicker'>
									<input type='text' class="form-control" />
									<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
								</span>
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="col-lg-4 control-label">Period</label>
						<div class="col-lg-6">
							<input type="text" class="form-control" id="period" placeholder="period">

					</div>
				</div>
				<div class="form-group">
					<div class="col-lg-10 col-lg-offset-3">
						<button class="btn btn-success">Cancel</button>
						<button type="submit" class="btn btn-success">Submit</button>
					</div>
				</div>
			</fieldset>
		</form>
		<!-- end form -->
	</div>


	<!-- begin account information -->
	<div class="page-header">
		<h3>Account information</h3>
	</div>
	<div>

		<button type="button" class="btn btn-default">
			<span class="glyphicon glyphicon-minus-sign"></span> Unactive
		</button>
		<button type="button" class="btn btn-default">
			<span class="glyphicon glyphicon-ok-circle"></span> Active
		</button>
	</div>
	<!-- begin address 1 -->
	<address>
		<!--Begin First name last name middle name-->
		<strong>Hoang Thuy Link</strong><br>
		<!--End First name last name middle name-->
		<!-- Address 1 -->
		69 Le Loi District 1 HCMC<br>
		<!--end address1-->
		<!--address 2-->
		69 Le Loi District 1 HCMC<br>
		<!--end address 2-->

		<!-- phone number1 -->
		<abbr title="Phone">P:</abbr> (123) 456-7890 </br>
		<!-- end phone number 2 -->
		<!-- phone number 2 -->
		<abbr title="Phone">P:</abbr> (123) 456-7890 <br/>
		<!-- end phone number 2 -->

		<!-- email_1 -->
		hoangthuylink@vn.vn
		<!-- end email_2 -->
		<br/>

		hoangthuylink@vnn.vn<br/>
	</address>
	<!-- end address 2 -->

	<!-- end account information -->


	<!-- begin sanving account information -->
	<div class="page-header">
		<h3 class="float_right">Saving account  information</h3>
	</div>

	<table class="table table-condensed">
		<thead>
			<tr>
				<th>Saving account number</th>
				<th>Date start</th>
				<th>Date end</th>
				<th>Interes rate</th>
				<th>Account balance</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>38585856045</td>
				<td>14/8/2014</td>
				<td>14/12/2014</td>
				<td>5</td>
				<td>$20000</td>
			</tr>


		</tbody>
	</table>
	<!-- end saving account information -->

	<!-- begin transaction detail -->
	<div class="page-header">
		<h3 class="float_right">Transaction details</h3>
	</div>
	<table class="table table-condensed">
		<thead>
			<tr>
				<th>Saving account number</th>
				<th>Date</th>
				<th>Amount</th>
				<th>Transaction type</th>
				<th>Transaction state</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>38585856045</td>
				<td>14/8/2014</td>
				<td>2000</td>
				<td>Withdraw</td>
				<td>
					<span class="label label-default">New</span>
					<span class="label label-primary">Approved</span>
					<span class="label label-success">Rejected</span>
				</td>
			</tr>

			<tr>
				<td>38585856045</td>
				<td>14/8/2014</td>
				<td>2000</td>
				<td>Withdraw</td>
				<td>
					<span class="label label-default">New</span>
					<span class="label label-primary">Approved</span>
					<span class="label label-success">Rejected</span>
				</td>
			</tr>
			<tr>
				<td>38585856045</td>
				<td>14/8/2014</td>
				<td>2000</td>
				<td>Withdraw</td>
				<td>
					<span class="label label-default">New</span>
					<span class="label label-primary">Approved</span>
					<span class="label label-success">Rejected</span>
				</td>
			</tr>
			<tr>
				<td>38585856045</td>
				<td>14/8/2014</td>
				<td>2000</td>
				<td>Withdraw</td>
				<td>
					<span class="label label-default">New</span>
					<span class="label label-primary">Approved</span>
					<span class="label label-success">Rejected</span>
				</td>
			</tr>
		</tbody>
	</table>

	<!-- begin pagination -->
	<ul class="pagination">

		<li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
		<li><a href="#">2</a></li>
		<li><a href="#">3</a></li>
		<li><a href="#">4</a></li>
		<li><a href="#">5</a></li>

	</ul>
	<!-- end pagination -->
	<!-- end transaction detail -->
</div>

<!--end main row-->
</div>
<!-- end right content -->
</div>

<script type="text/javascript" src="js/moment.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/bootstrap-datetimepicker.css">
<script type="text/javascript" src="js/bootstrap-datetimepicker.js"></script>
<link rel="stylesheet" type="text/css" href="css/site.css">
<script type="text/javascript" src="js/site.js"></script>
</body>
</html>